import 'package:flutter/material.dart';

class TabBarWidget extends StatefulWidget {
  TabBarWidget({Key key}) : super(key: key);

  @override
  _TabBarWidgetState createState() => _TabBarWidgetState();
}

class _TabBarWidgetState extends State<TabBarWidget> {

  int _currentIndex = 0;

  @override
  Widget build(BuildContext context) {
    return BottomNavigationBar(
      // 设置激活状态索引，索引从 0 开始
      currentIndex: _currentIndex,
      // 导航栏条目大于4个，需要指定类型
      type: BottomNavigationBarType.fixed,
      // 设置激活状态的背景颜色
      fixedColor: Colors.green[500],
      items: [
        BottomNavigationBarItem(
          icon: Icon(Icons.home),
          label: "Home"
        ),
        BottomNavigationBarItem(
          icon: Icon(Icons.history),
          label: "History"
        ),
        BottomNavigationBarItem(
          icon: Icon(Icons.search),
          label: "Search"
        ),
        BottomNavigationBarItem(
          icon: Icon(Icons.person),
          label: "My"
        ),
      ],
      onTap: _onTapHandler,
    );
  }

  void _onTapHandler(int index) {
    // 设置当前的tabbar的状态
    setState(() {
      _currentIndex = index;
    });
  }
}